<script setup lang="ts">
import { ClassChangeApi } from '@/apis'
import { useForm, useTable } from '@/hooks'
import CancelList from '@/views/education/cancel/CancelList.vue'

const route = useRoute()

const { form } = useForm<ClassChangeApi.ClassCancelQuery>({
  studentId: '',
  grade: '',
  classId: route.query.id as string,
  changeType: 'CANCEL_CLASS',
  operateSource: '',
  operateStatus: 'SUCCESS',
  startTime: '',
  endTime: '',
})
const {
  tableData: records,
  loading,
  pagination,
  search,
} = useTable(pagination => ClassChangeApi.getCancelPage({ ...form, ...pagination }))

watch(form, () => search(), { immediate: true, deep: true })
</script>

<template>
  <CancelList v-model:form="form" :records :loading :pagination @refresh="search" />
</template>

<style lang="less" scoped></style>
